<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>登录/注册</title>
</head>
<body>
<!-- 登录表单 -->
<div id="loginForm">
  <h3>登录</h3>
  <input type="text" id="loginUsername" placeholder="用户名"><br>
  <input type="password" id="loginPassword" placeholder="密码"><br>
  <button onclick="login()">登录</button>
  <p>没有账号？<button onclick="showRegister()">注册</button></p>
</div>

<!-- 注册表单（默认隐藏） -->
<div id="registerForm" style="display: none;">
  <h3>注册</h3>
  <input type="text" id="regUsername" placeholder="用户名"><br>
  <input type="password" id="regPassword" placeholder="密码"><br>
  <input type="password" id="regConfirmPassword" placeholder="确认密码"><br>
  <button onclick="register()">注册</button>
  <p>已有账号？<button onclick="showLogin()">登录</button></p>
</div>

<script>
  // 切换到注册表单
  function showRegister() {
    document.getElementById('loginForm').style.display = 'none';
    document.getElementById('registerForm').style.display = 'block';
  }

  // 切换到登录表单
  function showLogin() {
    document.getElementById('registerForm').style.display = 'none';
    document.getElementById('loginForm').style.display = 'block';
  }

  // 注册逻辑
  function register() {
    const username = document.getElementById('regUsername').value;
    const password = document.getElementById('regPassword').value;
    const confirmPassword = document.getElementById('regConfirmPassword').value;

    // 简单验证
    if (!username || !password || !confirmPassword) {
      alert('请填写完整信息');
      return;
    }
    if (password !== confirmPassword) {
      alert('两次密码不一致');
      return;
    }

    // 发送注册请求
    fetch('/auth/register', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ username, password, confirmPassword })
    })
            .then(response => response.json())
            .then(result => {
              if (result.code === 200) {
                alert('注册成功，请登录');
                showLogin(); // 跳转到登录表单
                document.getElementById('loginUsername').value = username; // 回填用户名
              } else {
                alert(result.message || '注册失败');
              }
            })
            .catch(error => alert('网络错误，请重试'));
  }

  // 登录逻辑
  function login() {
    const username = document.getElementById('loginUsername').value;
    const password = document.getElementById('loginPassword').value;

    if (!username || !password) {
      alert('请填写用户名和密码');
      return;
    }

    fetch('/auth/login', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ username, password })
    })
            .then(response => response.json())
            .then(result => {
              if (result.code === 200) {
                // -------- 新增：存储 Token 和用户信息到 LocalStorage --------
                const { token, username, roleId, roleName } = result.data;
                localStorage.setItem('token', token); // 存储 JWT Token
                localStorage.setItem('userInfo', JSON.stringify({
                  username,
                  roleId,
                  roleName
                })); // 存储用户信息
                // -------- 跳转 success.html（无需带 URL 参数，页面从 LocalStorage 读取） --------
                window.location.href = 'success.html';
              } else {
                alert(result.message || '登录失败');
              }
            })
            .catch(error => alert('网络错误，请重试'));
  }
</script>
</body>
</html>